<template>
	<u-popup :overlay="false" :show="isShow" bgColor="rgba(0,0,0,0)" mode="top" :safeAreaInsetBottom="false" round="20rpx">
		<view @click="isShow = false" style="background-color: rgba(0,0,0,0);" class="position-relative wrapper w-100 flex flex-column align-stretch border-box justify-end">
			<view @click.stop="tapContent" class="mx-32 content_wrapper rounded-radius-l flex flex-column align-center position-relative justify-between py-2 px-32 border-box">
				<text class="font text-white font-weight-normal">不想错过最新组讯？</text>
				<text class="font text-white font-weight-heavy">加入通告群</text>
				<view @click.stop="isShow = false" class="position-absolute close_btn">
					<u-icon name="/static/close_w.svg" color="#fff" size="20rpx"> </u-icon>
				</view>
			</view>
		</view>
	</u-popup>
</template>

<script setup>
	import { ref, watch } from 'vue'
	const props = defineProps({
		show: {
			type: Boolean,
			default: false
		},
		list: {
			type: Array,
			default: []
		},
		act: {
			type: String,
			default: '全国'
		}
	})
	const tapContent = () => {
		isShow.value = false
		emits('click')
	}
	const isShow = ref(false)
	const emits = defineEmits(['update:show', 'click']) // 声明emit
	watch(() => props.show, () => {
	   isShow.value = props.show
	})
	watch(() => isShow.value, () => {
	    emits('update:show', isShow.value)
	})
</script>

<style lang="scss" scoped>
	.wrapper {
		height: calc(14vh + 124rpx);
		.content_wrapper {
			height: 124rpx;
			background-color: rgba(0, 122, 255, 1);
		}
		.close_btn {
			top: 20rpx;
			left: 20rpx;
		}
	}
</style>